// 判断是否有权限
function hasPermission(roles, route) {
    if (route.meta && route.meta.roles) {
      // roles.some => Array.some 相当于是只要有一个满足就为true 
        
      // 判断用户的权限于当前路由访问所需要的权限是否有一个满足
      // 比如说用户权限为 ['one','two']  当前路由访问所需要权限为 ['two','three']  那么就说明当前用户可以访问这个路由
      return roles.some(role => route.meta.roles.includes(role))
    } else {
      // 默认是可访问的
      return true
    }
  }
  // 生成可访问路由
  export function filterAsyncRoutes(routes, roles) {
    const res = []
  
    routes.forEach(route => {
      const tmp = { ...route }
      // 判断当前路由是否可以访问
      if (hasPermission(roles, tmp)) {
        // 如果当前路由还有子路由
        if (tmp.children) {
          // 进行递归处理
          tmp.children = filterAsyncRoutes(tmp.children, roles)
        }
        // 将可访问路由放入数组中
        res.push(tmp)
      }
    })  
    // 返回
    return res
  }
  // 为什么要写这里呢，因为后面的Sidebar组件与这个环环相扣
  const mutations = {
    SET_ROUTES: (state, routes) => {
      // 添加的路由
      state.addRoutes = routes
      // 将vuex中的路由进行更新
      state.routes = constantRoutes.concat(routes)
    }
  }
  const actions = {
    generateRoutes({ commit }, roles) {
      return new Promise(resolve => {
        let accessedRoutes
        // 如果roles包含 'admin' 直接可以全部访问
        if (roles.includes('admin')) {
          accessedRoutes = asyncRoutes || []
        } else {
          // 利用 filterAsyncRoutes 过滤出可访问的路由
          accessedRoutes = filterAsyncRoutes(asyncRoutes, roles)
        }
        // 保存可访问的路由到store中
        commit('SET_ROUTES', accessedRoutes)
        // 将可访问路由返回
        resolve(accessedRoutes)
      })
    }
  }
  